<!DOCTYPE html>
<html lang="zh">

<head>
	<link rel="icon" href="https://qzonestyle.gtimg.cn/aoi/img/logo/favicon.ico">
	<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>QQ空间备份-访客</title>
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" integrity="sha256-eZrrJcwDc/3uDhsdt61sL2oOBY362qM3lon1gyExkL0=" crossorigin="anonymous">
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lightgallery@1.6.14/dist/css/lightgallery.min.css" integrity="sha256-8rfHbJr+ju3Oc099jFJMR1xAPu8CTPHU8uP5J3X/VAY=" crossorigin="anonymous">
	<link rel="stylesheet" type="text/css" href="../Common/css/common.css">
	<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/lightgallery@1.6.14/dist/js/lightgallery-all.min.js" integrity="sha256-0q70xbZ3GMwdiseCj/wfChJhq/3wzpNdgZinlSxSw14=" crossorigin="anonymous"></script>
	<script src="https://cdn.jsdelivr.net/npm/jquery-mousewheel@3.1.13/jquery.mousewheel.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/lazyload@2.0.0-rc.2/lazyload.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/template_js@2.2.1/dist/index.aio.min.js" integrity="sha256-gnK+GsIXEBgu/mJouMDtUxXvXM3M0jzxNYmjnlsifgY=" crossorigin="anonymous"></script>
	<script type="text/javascript" src="json/visitors.js"></script>
	<script type="text/javascript" src="../Common/js/common.js"></script>
	<script type="text/javascript" src="../Common/js/sidebar.js"></script>
	<script type="text/javascript" src="js/visitors.js"></script>
</head>

<body>
	<header>
		<nav class="navbar navbar-expand-lg navbar-dark fixed-top bg-dark">
			<a class="navbar-brand" target="_blank" href="https://github.com/ShunCai/QZoneExport">QQ空间导出助手</a>
			<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
				<span class="navbar-toggler-icon"></span>
			</button>
			<div class="collapse navbar-collapse" id="navbarSupportedContent">
				<nav aria-label="breadcrumb">
					<ol class="breadcrumb bg-dark">
						<li class="breadcrumb-item"><a href="../index.html">个人中心</a></li>
						<li class="breadcrumb-item active" aria-current="page">访客</li>
					</ol>
				</nav>
			</div>
		</nav>
	</header>
	<main role="main" class="flex-shrink-0">
		<div id="visitors_html" class="container messages">
			<div class="col-xs-10">
				<div class="timeline2-centered">
					<%if(visitors && visitors.length > 0){%>
						<%/* 年份分组 */%>
						<%const yearMaps = API.Utils.groupedByTime(visitors, "time", "year");%>
						<%for (const [year, yearItems] of yearMaps) {%>
							<div class="timeline2-entry">
								<div class="timeline2-entry-year">
									<div class="timeline2-icon">
										<span class="sidebar-h1" data-tag="h1" data-sidebar="<%:=year%>年"><%:=year%></span>
									</div>
								</div>
							</div>
							<%/* 月份分组 */%>
							<%const monthMaps = API.Utils.groupedByTime(yearItems, "time", "month");%>
							<%for (const [month, monthItems] of monthMaps) {%>
								<div class="timeline2-entry">
									<div class="timeline2-entry-month">
										<div class="timeline2-icon">
											<span class="sidebar-h2" data-tag="h2" data-sidebar="<%:=month%>月"><%:=month%>月</span>
										</div>
									</div>
								</div>
								<%/* 天数分组 */%>
								<%const dayMaps = API.Utils.groupedByTime(monthItems, "time", "day");%>
								<%for (const [day, dayItems] of dayMaps) {%>
									<div class="timeline2-entry">
										<div class="timeline2-entry-day">
											<div class="timeline2-icon">
												<span class="sidebar-h3" data-tag="h3" data-sidebar="<%:=day%>日"><%:=day%>日</span>
											</div>
										</div>
									</div>
									<%/* 遍历 */%>
									<%for (const item of dayItems) {%>
										<div class="timeline2-entry">
											<div class="timeline2-entry-inner">
												<div class="timeline2-time">
													<span><%:=API.Utils.formatDate(item.time,'hh:mm')%></span>
												</div>
												<div class="timeline2-icon">
													<a href="<%:=API.Common.getUserUrl(item.uin)%>" target="_blank">
														<img class="lazyload loading w-100 h-100 border rounded-circle" data-src="<%:=API.Common.getUserLogoUrl(item.uin)%>" src="<%:=API.Common.getUserLogoUrl(item.uin)%>"></i>
													</a>
												</div>
												<div class="timeline2-label">
													<a href="<%:=API.Common.getUserUrl(item.uin)%>" target="_blank"><%:=API.Common.formatContent(item.name)%></a><span class="ml-1"><%:=API.Visitors.getTitle(item)%></span>
													<%if(!API.Visitors.isHome(item)){%>
														<%if(item.shuoshuoes && item.shuoshuoes.length > 0){%>
															<div class="row visitor-list">
																<span class="fa fa-wechat ml-3 mt-2" title="说说"></span>
																<ul id="poster-list" class="list-group list-group-flush col">
																	<%for(const shuoshuo of item.shuoshuoes){%>
																		<li class="list-group-item p-1">
																			<a class="text-muted text-decoration-none" title="访问于 <%:=API.Utils.formatDate(item.time,'hh:mm')%>" href="<%:=shuoshuo.url%>" target="_blank">
																				<p class="mb-0"><%:=API.Common.formatContent(shuoshuo.name)%></p>
																			</a>
																			<%if(shuoshuo.imgsrc){%>
																				<div class="poster_img mt-2">
																					<a href="<%:=shuoshuo.url%>" target="_blank">
																						<img title="访问于 <%:=API.Utils.formatDate(item.time,'hh:mm')%>" src="<%:=(shuoshuo.custom_filepath || shuoshuo.custom_url)%>">
																					</a>
																				</div>
																			<%}%>
																		</li>
																	<%}%>
																</ul>
															</div>
														<%}%>
														<%if(item.blogs && item.blogs.length > 0){%>
															<div class="row visitor-list">
																<span class="fa fa-book ml-3 mt-2" title="日志"></span>
																<ul id="poster-list" class="list-group list-group-flush col">
																	<%for(const blog of item.blogs){%>
																		<li class="list-group-item p-1">
																			<a class="text-muted text-decoration-none" title="访问于 <%:=API.Utils.formatDate(item.time,'hh:mm')%>" href="<%:=blog.url%>" target="_blank">
																				<p class="mb-0"><%:=API.Common.formatContent(blog.name)%></p>
																			</a>
																		</li>
																	<%}%>
																</ul>
															</div>
														<%}%>
														<%if(item.photoes && item.photoes.length > 0){%>
															<div class="row visitor-list">
																<span class="fa fa-photo ml-3 mt-2" title="相册"></span>
																<ul class="list-group list-group-horizontal col">
																	<%for(const photo of item.photoes){%>
																		<li class="list-group-item p-1">
																			<div class="card album p-1" title="访问于 <%:=API.Utils.formatDate(item.time,'hh:mm')%>">
																				<a href="<%:=photo.url%>" target="_blank" class="image" style="width: 100px; height: 100px; overflow: hidden;">
																					<img src="<%:=(photo.custom_filepath || photo.custom_url)%>" height="100">
																				</a>
																				<div class="card-body text-center text-truncate p-2">
																					<a class="text-muted text-decoration-none" href="<%:=photo.url%>" target="_blank"><%:=API.Common.formatContent(photo.name)%></a>
																				</div>
																			</div>
																		</li>
																	<%}%>
																</ul>
															</div>
														<%}%>
														<%if(item.shares && item.shares.length > 0){%>
															<div class="row visitor-list">
																<span class="fa fa-share-alt ml-3 mt-2" title="分享"></span>
																<ul id="poster-list" class="list-group list-group-flush col">
																	<%for(const share of item.shares){%>
																		<li class="list-group-item p-1">
																			<a class="text-muted text-decoration-none" title="访问于 <%:=API.Utils.formatDate(item.time,'hh:mm')%>" href="<%:=share.url%>" target="_blank">
																				<p class="mb-0"><%:=API.Common.formatContent(share.name)%></p>
																			</a>
																			<%if(share.imgsrc){%>
																				<div class="poster_img mt-2">
																					<a href="<%:=share.url%>" target="_blank">
																						<img title="访问于 <%:=API.Utils.formatDate(item.time,'hh:mm')%>" src="<%:=(share.custom_filepath || share.custom_url)%>">
																					</a>
																				</div>
																			<%}%>
																		</li>
																	<%}%>
																</ul>
															</div>
														<%}%>
														<%if(item.uins && item.uins.length > 0){%>
															<div class="visitor-list ml-3">
																<p class="p-2">以下这些访客当天也访问了这些内容： </p>
																<ul class="list-group list-group-horizontal col">
																	<%for (const uniItem of item.uins) {%>
																		<li class="list-group-item p-1">
																			<div class="card album p-1" title="访问于 <%:=API.Utils.formatDate(uniItem.time,'hh:mm')%>">
																				<a href="<%:=API.Common.getUserUrl(uniItem.uin)%>" target="_blank" class="image" style="width: 100px; height: 100px; overflow: hidden;">
																					<img src="<%:=API.Common.getUserLogoUrl(uniItem.uin)%>" height="100">
																				</a>
																				<div class="card-body text-center text-truncate p-2">
																					<a class="card-title text-muted text-decoration-none" href="<%:=API.Common.getUserUrl(uniItem.uin)%>" target="_blank"><%:=API.Common.formatContent(uniItem.name)%></a>
																				</div>
																				<p class="card-text text-right border-top">
																					<small class="text-muted"><%:=API.Utils.formatDate(uniItem.time,'hh:mm')%></small>
																				</p>
																			</div>
																		</li>
																	<%}%>
																</ul>
															</div>
														<%}%>
													<%}%>
												</div>
											</div>
										</div>
									<%}%>
									<hr>
								<%}%>
							<%}%>
						<%}%>
					<%}%>
				</div>
			</div>
		</div>
	</main>
</body>

</html>